<template>
	<view class="tz-list">
		<view class="list-box" v-for="(item, index) in list" :key="item.prop" @click="linkTo(index)">
			<view class="list-icon">
				<u-icon name="file-text-fill" color="#f75a00" size="44"></u-icon>
			</view>
			<view class="list-right">
				<view class="title-row">
					<p class="u-line-1">{{item.F_SpecialWorkName}}</p>
					<u-icon name="arrow-right" color="#B9BEC3" size="24"></u-icon>
				</view>
				<view class="bottom-row">
					<view class="people-message">
						<text>{{item.F_WorkType}}</text>
						<text class="worktime">{{item.F_SpecialWorkTime}}年</text>
					</view>
					<text class="time-valid">有效期：{{item.F_ValidityTime}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import resources from '@/libs/resources.js'
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import {
		getDictionaryDataSelector,
		getDataInterfaceRes
	} from '@/api/common'
	import request from '@/utils/request'
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				sortValue: '',
				searchForm: {
					specialworkname: undefined,
					workshop: undefined,
					specialpeoplename: undefined,
					workteam: undefined,
					worktype: undefined,
					specialworktime: undefined,
					specialworknum: undefined,
					specialissuedate: undefined,
					specialissuegroup: undefined,
					studytime: undefined,
					onetrial: undefined,
					twotrial: undefined,
					validitytime: undefined,
					delaytime: undefined,
					extendtime: undefined,
				},
				downOption: {
					use: true,
					auto: false
				},
				upOption: {
					page: {
						num: 0,
						size: 20,
						time: null,
					},
					empty: {
						use: true,
						icon: resources.message.nodata,
						tip: "暂无数据",
						fixed: true,
						top: "300rpx",
						zIndex: 5,
					},
					textNoMore: '没有更多数据',
					toTop: {
						bottom: 250
					}
				},
				list: [
						
					],
				listQuery: {
					sort: 'desc',
					sidx: '',
					keyword: '',
					json: ''
				},
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#dd524d'
					}
				}, ],
				sortOptions: [{
						label: '特种证书名称降序',
						sidx: 'specialworkname',
						value: 'specialworknamedesc',
						sort: 'desc'
					},
					{
						label: '特种证书名称升序',
						sidx: 'specialworkname',
						value: 'specialworknameasc',
						sort: 'asc'
					},
					{
				  label: '所在车间降序',
						sidx: 'workshop',
						value: 'workshopdesc',
						sort: 'desc'
					},
					{
						label: '所在车间升序',
						sidx: 'workshop',
						value: 'workshopasc',
						sort: 'asc'
					},
					{
						label: '证书持有人降序',
						sidx: 'specialpeoplename',
						value: 'specialpeoplenamedesc',
						sort: 'desc'
					},
					{
						label: '证书持有人升序',
						sidx: 'specialpeoplename',
						value: 'specialpeoplenameasc',
						sort: 'asc'
					},
					{
						label: '所在班组降序',
						sidx: 'workteam',
						value: 'workteamdesc',
						sort: 'desc'
					},
					{
						label: '所在班组升序',
						sidx: 'workteam',
						value: 'workteamasc',
						sort: 'asc'
					},
					{
						label: '工种降序',
						sidx: 'worktype',
						value: 'worktypedesc',
						sort: 'desc'
					},
					{
						label: '工种升序',
						sidx: 'worktype',
						value: 'worktypeasc',
						sort: 'asc'
					},
					{
						label: '专业工龄降序',
						sidx: 'specialworktime',
						value: 'specialworktimedesc',
						sort: 'desc'
					},
					{
						label: '专业工龄升序',
						sidx: 'specialworktime',
						value: 'specialworktimeasc',
						sort: 'asc'
					},
					{
						label: '证书编号降序',
						sidx: 'specialworknum',
						value: 'specialworknumdesc',
						sort: 'desc'
					},
					{
						label: '证书编号升序',
				  sidx: 'specialworknum',
						value: 'specialworknumasc',
						sort: 'asc'
				 },
					{
						label: '发证日期降序',
						sidx: 'specialissuedate',
						value: 'specialissuedatedesc',
						sort: 'desc'
					},
					{
						label: '发证日期升序',
						sidx: 'specialissuedate',
						value: 'specialissuedateasc',
						sort: 'asc'
					},
					{
						label: '发证机关降序',
						sidx: 'specialissuegroup',
						value: 'specialissuegroupdesc',
						sort: 'desc'
					},
					{
						label: '发证机关升序',
				 	sidx: 'specialissuegroup',
						value: 'specialissuegroupasc',
						sort: 'asc'
					},
					{
						label: '培训时间降序',
						sidx: 'studytime',
						value: 'studytimedesc',
						sort: 'desc'
					},
				 {
						label: '培训时间升序',
						sidx: 'studytime',
						value: 'studytimeasc',
						sort: 'asc'
					},
					{
						label: '一次复审降序',
						sidx: 'onetrial',
						value: 'onetrialdesc',
				 	sort: 'desc'
					},
					{
						label: '一次复审升序',
						sidx: 'onetrial',
						value: 'onetrialasc',
						sort: 'asc'
					},
					{
						label: '二次复审降序',
						sidx: 'twotrial',
						value: 'twotrialdesc',
				 	sort: 'desc'
					},
					{
						label: '二次复审升序',
						sidx: 'twotrial',
						value: 'twotrialasc',
						sort: 'asc'
					},
					{
						label: '有效期降序',
						sidx: 'validitytime',
						value: 'validitytimedesc',
						sort: 'desc'
					},
					{
						label: '有效期升序',
						sidx: 'validitytime',
						value: 'validitytimeasc',
						sort: 'asc'
					},
					{
				 	label: '延期时间降序',
						sidx: 'delaytime',
						value: 'delaytimedesc',
						sort: 'desc'
					},
					{
				 	label: '延期时间升序',
						sidx: 'delaytime',
						value: 'delaytimeasc',
						sort: 'asc'
					},
					{
						label: '延长时间降序',
						sidx: 'extendtime',
						value: 'extendtimedesc',
						sort: 'desc'
					},
					{
						label: '延长时间升序',
						sidx: 'extendtime',
						value: 'extendtimeasc',
						sort: 'asc'
					},
				],
				menuId: '',
			}
		},
		onLoad(e) {
			this.menuId = e.menuId
			uni.$on('refresh', () => {
				this.list = [];
				this.mescroll.resetUpScroll();
			})
			this.dataAll()
			this.upCallback()
		},
		onUnload() {
			uni.$off('refresh')
		},
		methods: {
			linkTo(index){
				
				uni.navigateTo({
					url: '/pages/apply/tezhongzuoye/tezhong_details/index?id='+this.list[index].F_Id,
					fail: (err) => {
						this.$u.toast("暂无此页面")
					}
				})
			},
			
			dataAll() {},
			closeData(e) {
				if (e == 1) {
					// this.reset()
				}
			},
			upCallback(page) {
				//             for(let i in this.searchForm){
				// 	if(!this.searchForm[i]){
				// 		delete this.searchForm[i]
				// 	}
				// }
			
				const query = {
					accountId:JSON.parse(localStorage.getItem('userInfo')).data.userId
				}
				request({
					url: '/api/system/DataInterface/357266881230406085/Actions/Response',
					method: 'post',
					data: query,
				}).then(res => {
					this.list = res.data.data 
				console.log(this.list);
				}).catch(() => {
				console.log('x');
				})
			},
			handleClick(index, index1) {
				const item = this.list[index]
				request({
					url: '/api/example/Mt_safe_special_work/' + item.id,
					method: 'delete'
				}).then(res => {
					uni.showToast({
						title: res.msg,
						complete: () => {
							this.$u.toast(res.msg)
							this.list.splice(index, 1)
							if (!this.list.length) this.mescroll.showEmpty()
						}
					})
				})
			},
			open(index) {
				this.list[index].show = true;
				this.list.map((val, idx) => {
					if (index != idx) this.list[idx].show = false;
				})
			},
			search() {
				if (this.isPreview == '1') return
				this.searchTimer && clearTimeout(this.searchTimer)
				this.searchTimer = setTimeout(() => {
					this.list = [];
					this.mescroll.resetUpScroll();
				}, 300)
			},
			goDetail(id, status) {
				let btnType = ''
				let btnList = []
				btnList.push('btn_edit')
				btnList.push('btn_detail')
				if (btnList.includes('btn_detail')) {
					btnType = "btn_detail"
				}
				if (btnList.includes('btn_edit')) {
					btnType = "btn_edit"
				}
				if (!btnType) return
				this.jumPage(id, status, btnType)
			},
			addPage() {
				this.jumPage()
			},
			jumPage(id, status, btnType) {
				if (!id && !status) btnType = 'btn_add'
				uni.navigateTo({
					url: id ? './form?menuId=' + this.menuId + '&jurisdictionType=' + btnType + '&id=' + id :
						'./form?menuId=' + this.menuId + '&jurisdictionType=' + btnType
				})
			},
			cellClick(item) {
				if (this.sortValue === item.value) return
				this.listQuery.sort = item.sort
				this.listQuery.sidx = item.sidx
				this.sortValue = item.value
				this.$refs.uDropdown.close();
				this.$nextTick(() => {
					this.list = [];
					this.mescroll.resetUpScroll();
				})
			},
			reset() {
				this.$refs.searchForm.resetFields()
			},
			closeDropdown() {
				this.$refs.uDropdown.close();
				this.$nextTick(() => {
					this.list = [];
					this.mescroll.resetUpScroll();
				})
			},
			dataList(data) {
				let _list = []
				for (let i = 0; i < data.list.length; i++) {
					let _data = data.list[i]
					_list.push(_data)
				}
				return _list;
			},
		},
	}
</script>

<style lang="scss">
	.worktime{
		margin-left: 40rpx;
	}
	page {
		background-color: #f0f2f6;
		height: 100%;
		/* #ifdef MP-ALIPAY */
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		/* #endif */
		.tz-list{
			padding: 20rpx;
			.list-box{
				display:flex;
				align-items: center;
				padding: 28rpx;
				background-color: #fff;
				border-radius: 16rpx;
				margin-bottom: 20rpx;
				.list-icon{
					width: 88rpx;
					height: 88rpx;
					border-radius: 12rpx;
					margin-right: 20rpx;
					background-color: #FFF7ED;
					display: flex;
					justify-content: center;
					align-items: center;
					flex-shrink: 0;
				}
				.list-right{
					width: 100%;
					.title-row{
						display: flex;
						justify-content: space-between;
						p{
							font-size: 30rpx;
							color: #333333;
							font-weight: bold;
						}
					}
					.bottom-row{
						margin-top:20rpx;
						display: flex;
						justify-content: space-between;
						align-items: center;
						.people-message{
							color: #333333;
							font-weight: 400;
							font-size: 28rpx;
						}
						.time-valid{
							color: #797F85;
							font-size: 26rpx;
						}
					}
				}
			}
		}
	}
</style>
